import './index.less';
import { HashRouter as Router, Route, Redirect} from 'react-router-dom';
import { Provider } from 'mobx-react';
import store from './store';
import Palace from './pages/palace';
import Mess from './pages/mess';
import Coupon from './pages/coupon';
import Other from './pages/other';
import Login from './pages/login';

const myStore = new store();
//myStore.init();

const Routers = () => (
  <Router>
    <div>
      <Route path="/" component={Login} />
      <LoginRoute path="/palace" component={Palace} />
      <LoginRoute path="/mess" component={Mess} />
      <LoginRoute path="/coupon" component={Coupon} />
      <LoginRoute path="/other" component={Other} />
    </div>
  </Router>
);

const LoginRoute = ({ component: Component, ...rest }) =>{
  return (
    <Route {...rest} render={props => (
    myStore.loginCode.length ? (
      <Component {...props}/>
    ) : (
      <Redirect to={{
        pathname: '/',
        state: { from: props.location }
      }}/>
    )
  )}/>
  );
};

ReactDom.render(
  <Provider store={myStore}>
    <Routers />
  </Provider>,
  document.getElementById('root')
);


